<template>
	<view class="relative">
		<bg-video></bg-video>
		<cu-custom bgColor="bg-main" :isBack="true">
			<block class="text-white" slot="content">房间</block>
		</cu-custom>
		<view class="fixed w-100" :style="{zIndex: 999}">
			<view :style="{height: StatusBar+'px'}" class="cu-bar bg-white search">
				<view class="search-form round">
					<text class="cuIcon-search"></text>
					<input type="text" v-model="searchObj.fjname" placeholder="输入搜索的关键词" confirm-type="search"></input>
				</view>
				<view class="action">
					<button class="cu-btn bg-main  round" @tap="search">搜索</button>
				</view>
			</view>
			<view class="bg-white" >
				
			</view>
		</view>
		
		<view :style="{paddingTop: StatusBar*1+'px'}">
			<view class="padding-xs " v-for="(fj,index) in fjs" :key="index">
				<view class="bg-white shadow radius padding-xxs flex justify-between">
					<view class="w-25">
						<view class="relative w-100 radius overflow-hidden">
							<view class="img-cover relative">
							</view>
							<view class="absolute top0 w-100 h-100">
								<image class="w-100 h-100" mode="aspectFill" :src="fj.cover"></image>
							</view>
						</view>
						<view>
							
						</view>
					</view>
					<view class="w-75">
						<view class="padding-xs">
							<text>{{fj.fjmc}}</text>
						</view>
						<view class="padding-xs">
							<text>{{fj.mdmc}}</text>
						</view>
						<view class="padding-xs flex justify-between align-center">
							<text>{{fj.mj}}㎡</text>
							<uni-rate size="14"  :value="fj.rate"></uni-rate>
						</view>
						<view class="padding-xs flex justify-between align-center">
							<view>{{tp[fj.tp]}}</view>
							<view>{{func[fj.func]}}</view>
						</view>
						<view class="padding-xs flex justify-between align-center">
							<view>{{fj.yyitems}}次预约</view>
							<view><text @tap="toFjInfo(fj.fjid)" class="cu-tag bg-main radius">预约</text></view>
						</view>
						
					</view>
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	export default {
		
		data: function() {
			return {
				CustomBar: this.CustomBar,
				StatusBar: this.StatusBar,
				fjs: [],
				pageInfo: {
					current: 1,
					size: 16,
					total: 0
				},
				locamap: {},
				tp: {},
				func: {},
				searchObj: {
					fjname: "",
					mdid: "",
					tp: "",
					func: "",
					cd: null,
					st: null,
					et: null
				}
				
			}
		},
		computed: {
			currentPosition: function() {
				if (this.store.state.position) {
					return this.store.state.position;
				}
				return undefined;
			}
		},
		created: function() {
			this.constant.get("ROOMFUNC").then(data => {
				this.func = data.ROOMFUNC;
			});
			this.constant.get("ROOMTP").then(data => {
				this.tp = data.ROOMTP;
			});
		},
		onLoad: function() {
			
			this.search();
		},
		methods: {
			search: function(param) {
				this.fjs = [];
				this.pageInfo.current = 1;
				this.loadFjs(param);
			},
			loadFjs: function(param) {
				
				if (param) {
					this.searchObj.mdid = param.mdid;
					this.searchObj.func = param.func;
					this.searchObj.tp = param.tp;
					this.searchObj.cd = param.cd;
					this.searchObj.st = param.st;
					this.searchObj.et = param.et;
				}
				
				this.searchObj.current = this.pageInfo.current;
				this.searchObj.size = this.pageInfo.size;
				this.searchObj.flg = true;
				
				if (this.currentPosition) {
					this.searchObj.jd = this.currentPosition.jd;
					this.searchObj.wd = this.currentPosition.wd;
				}
				
				this.api("/fj/page/get").send(this.searchObj).then(data => {
					this.pageInfo.current = data.fjs.current;
					for (let index in data.fjs.records) {
						let record = data.fjs.records[index];
						record.sheng = this.location.localmap.cmap[record.pcode].criname;
						record.shi = this.location.localmap.cmap[record.scode].criname;
						record.qu = this.location.localmap.cmap[record.qcode].criname;
						record.tpname = this.tp[record.tp];
						record.funcname = this.func[record.func];
						if (record.distance) {
							record.distance = this.util.formatDistance(record.distance);
						}
						this.fjs.push(record);
					}
				});
				
			},
			loadMore: function() {
				this.pageInfo.current++;
				this.loadFjs();
			},
			
			// 卡片点击处理
			toFjInfo: function(id) {
				uni.navigateTo({
					url: `/pages/cmd/fj/detail?fjid=${id}`
				})
			},
			
		}
	}
</script>

<style>
</style>